<template>
  <div>
    <real-time v-if="type == 1"></real-time>
    <app-security v-else-if="type == 2"></app-security>
    <vulnerability v-else-if="type == 3"></vulnerability>
    <network-intrusion v-else-if="type == 4"></network-intrusion>
  </div>
</template>

<script>
import RealTime from "./realTime.vue";
import appSecurity from "./appSecurity.vue";
import vulnerability from "./vulnerability.vue";
import networkIntrusion from "./networkIntrusion.vue";

export default {
  data() {
    return {
      type: 1,
    };
  },

  components: {
    RealTime,
    appSecurity,
    vulnerability,
    networkIntrusion,
  },
  props: {},
  mounted() {
    let type = this.$route.query.type;
    this.type = type || 1;
  },
  computed: {},
  watch: {
    $route: {
      handler: function (n, o) {
        let type = n.query.type;
        this.type = type || 1;
      },
      deep: true,
    },
  },
  methods: {},
  destroyed() {},
};
</script>
<style lang='scss' scoped>
</style>